<template>
	<view class="content-header">
		<view class="goodsinfo">
			<view class="flex-column goodsinfo-header">
				<image class="goodsinfo-img" src="../../static/order/infoimg.png" mode="widthFix"></image>
				<view class="goodsinfo-body">
					<view class="flex-row flex-content-between goodsinfo-body-info">
						<view class="flex-column">
							<view class="goodsinfo-body-name">竹笋牛腩</view>
							<view class="flex-row goodsinfo-body-text">
								<view class="goodsinfo-body-text1">￥88.28</view>
								<view class="goodsinfo-body-text2">￥100</view>
							</view>
							<view class="flex-row goodsinfo-body-zk flex-item-center">
								<image src="../../static/order/zk.png" mode="scaleToFill"></image>
								<view>8.8折</view>
							</view>
						</view>
						<view class="flex-column goodsinfo-foot">
							<view class="goodsinfo-foot-one">
								月售 112
							</view>
							<view class="flex-row goodsinfo-foots flex-item-center">
								<image src="../../static/order/jia.png" mode="scaleToFill"></image>
								<view>加入购物车</view>
							</view>
						</view>
					</view>
					
				</view>
			</view>
			
		</view>
		<mu-suspension bottom="0">
			<mu-shopping-cart :show_goods="show_goods" :all_cart="all_cart" :goods_cart="goods_cart" :settlement="settlement"></mu-shopping-cart>
		</mu-suspension>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				show_goods:false,//显示购物车商品
				all_cart:true,//全选
				goods_cart:[//购物车商品
					{
						id:"",
						selected:true,
					},
					{
						id:"",
						selected:false,
					},
					{
						id:"",
						selected:true,
					},
					{
						id:"",
						selected:false,
					},
					{
						id:"",
						selected:true,
					},
					{
						id:"",
						selected:false,
					},
					{
						id:"",
						selected:true,
					},
					{
						id:"",
						selected:true,
					},
					{
						id:"",
						selected:false,
					},
					{
						id:"",
						selected:true,
					},
					{
						id:"",
						selected:true,
					},
					{
						id:"",
						selected:true,
					}
				],
			}
		},
		methods:{
			//去结算
			settlement(){
				uni.navigateTo({
					url:'/pages/order/craete_order'
				})
			},
		}
	}
</script>

<style lang="scss">
	.goodsinfo-foot{
		
	}
	.goodsinfo-foots{
		width: 170rpx;
		height: 48rpx;
		background: #FF7336;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		opacity: 1;
		margin-top: 32rpx;
		// padding: ;
		>image{
			width: 21rpx;
			height: 21rpx;
			margin-left: 12rpx;
		}
		>view{
			font-size: 24rpx;
			font-family: PingFang SC-Bold, PingFang SC;
			font-weight: bold;
			color: $default-button-foncolor;
			margin-left: 4rpx;
		}
	}
	.goodsinfo-foot-one{
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #999999;
		>view:nth-child(2){
			
		}
	}
	.goodsinfo{
		/* margin-left: 30rpx;
		margin-right: 30rpx; */
		height: 640rpx;
		background-color: #FFFFFF;
	}
	.goodsinfo-body-zk{
		margin-top: 16rpx;
		>image{
			width: 21rpx;
			height: 21rpx;
		}
		>view{
			font-size: 20rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: $default-button-color;
			margin-left: 10rpx;
		}
	}
	.goodsinfo-img{
		width: 690rpx;
	}
	.goodsinfo-header{
		margin-left: 30rpx;
		margin-right: 30rpx;
	}
	.goodsinfo-body{
		/* margin-top: 40rpx; */
		background-color: #FFFFFF;
	}
	.goodsinfo-body-info{
		margin-top: 40rpx;
	}
	.goodsinfo-body-name{
		font-size: 36rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #333333;
	}
	.goodsinfo-body-text{
		margin-top: 20rpx;
	}
	.goodsinfo-body-text1{
		font-size: 32rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: $default-button-color;
	}
	.goodsinfo-body-text2{
		font-size: 24rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #CCCCCC;
		margin-left: 22rpx;
		text-decoration: line-through;
		line-height: 40rpx;
	}
</style>